<template>
    <div>
        <div class="container">
            <h2>捐 赠 详 情</h2>
            <el-form ref="form" :model="donation" label-width="100px">
                <el-form-item label="捐赠ID">
                    <el-input v-model="donation.donationId" disabled></el-input>
                </el-form-item>
                <el-form-item label="捐赠名称">
                    <el-input v-model="donation.donationName"></el-input>
                </el-form-item>
                <el-form-item label="捐赠对象">
                    <el-input v-model="donation.donationObject"></el-input>
                </el-form-item>
                <el-form-item v-if="donation.amount" label="捐赠金额">
                    <el-input v-model="donation.amount" disabled></el-input>
                </el-form-item>
                <el-form-item label="支付渠道" v-if="donation.amount">
                    <el-input v-model="donation.payType" disabled></el-input>
                </el-form-item>
                <el-form-item label="捐赠人">
                    <el-input v-model="donation.realName"></el-input>
                </el-form-item>
                <el-form-item label="性 别">
                    <el-input v-model="donation.sex"></el-input>
                </el-form-item>
                <el-form-item label="捐赠人手机号">
                    <el-input v-model="donation.phone"></el-input>
                </el-form-item>
                <el-form-item label="捐赠人身份">
                    <el-tag :type="donation.isAlumni===1 ? 'success' : ''">
                        {{donation.isAlumni === 1 ? '校友' : '其他'}}
                    </el-tag>
                </el-form-item>
                <el-form-item label="捐赠具体详情">
                    <el-input type="textarea" v-model="donation.details"></el-input>
                </el-form-item>
                <el-form-item label="捐赠核实">
                    <el-radio-group v-model="donation.confirm">
                        <el-radio :label="1">已核实</el-radio>
                        <el-radio :label="0">未核实</el-radio>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="创建人">
                    <el-input :value="donation.createOne ? donation.createOne.nick : '系统创建'" disabled></el-input>
                </el-form-item>
                <el-form-item label="创建时间">
                    <el-input v-model="donation.createTime" disabled></el-input>
                </el-form-item>
                <el-form-item label="更新人">
                    <el-input :value="donation.updateBy ? donation.updateOne.nick : '暂无更新'" disabled></el-input>
                </el-form-item>
                <el-form-item label="更新时间">
                    <el-input :value="donation.updateTime ? donation.updateTime : '暂无更新'" disabled></el-input>
                </el-form-item>
            </el-form>
            <div class="saveEdit">
                <el-button type="primary" @click="saveEdit" :disabled="flagChange<2">保存修改</el-button>
            </div>
        </div>
    </div>
</template>

<script>
    import { getRequest, postRequest } from '../../api';
    import { getTime } from '../../utils/dateTimeUtil';

    export default {
        name: 'DonationDetails',
        data(){
            return {
                donation: {},
                userId: Number(sessionStorage.getItem('userId')),
                userNick: sessionStorage.getItem('userNick'),
                flagChange: 0
            }
        },
        created() {
            const donationId=this.$route.query.donationId;
            getRequest('/getDonationDetail', {donationId: donationId}).then(res=>{
                if(res){
                    this.donation=res;
                }
            })
        },
        watch: {
          donation: {
              handler(val){
                  this.flagChange++;
              },
              deep: true
          }
        },
        methods: {
            saveEdit(){
                this.$confirm(`确定要保存对 "${this.donation.donationName}" 的修改吗？`,'提示', {type: 'warning'}).then(()=>{
                    this.donation.updateTime=getTime(new Date());
                    this.donation.updateBy=this.userId;
                    this.donation.updateOne={nick: this.userNick};
                    let data=JSON.parse(JSON.stringify(this.donation));
                    data.createOne=null;
                    data.updateOne=null;
                    data.alumni=null;
                    postRequest('/updateDonation', data).then(res=>{
                        if(res==='success'){
                            this.$message.success('保存成功！');
                        }else{
                            console.log('操作失败!');
                        }
                    })
                })
            }
        }
    };
</script>

<style scoped>
    h2{
        text-align: center;
        margin-bottom: 30px;
        color: #2d8cf0;
    }
    .saveEdit{
        text-align: center;
    }
    .el-form{
        width: 50%;
        margin: 0 auto;
    }
</style>